import React, { createContext, useContext } from "react";

const MsgContext = createContext();

const A = () => {
  return (
    <div>
      <h2>A组件</h2>
      <B></B>
    </div>
  );
};

const B = () => {
  const msg = useContext(MsgContext);
  return (
    <div>
      <h2>B组件, {msg}</h2>
    </div>
  );
};

const App = () => {
  const msg = "这是APP的消息"; // 定义msg变量
  return (
    <div>
      <h2>父组件</h2>
      <MsgContext.Provider value={msg}>
        <A></A>
      </MsgContext.Provider>
    </div>
  );
};

export default App;
